<template>
	<view class="sell">
		<view class="card" @click="navigateTo('information')"  v-if="false">
			<view class="flex " style="justify-content: space-between;">
				<view class="left">
					<view class="title">
						官网寄售
					</view>
					<view class="sub_title">
						商品上传寄售至淘气游官方平台
					</view>
					<view class="dec flex aitem_cener ">
						详情介绍 
						<image src="../../static/sell/icon_down@2x.png" mode="aspectFill" style="width: 20rpx;height: 20rpx;margin-left: 10rpx;"></image>
					</view>
				</view>
				<image class="rigntImg" src="../../static/sell/icon_1@2x.png" mode="aspectFill"></image>
			</view>
			<view class="totas">
				<view class="flex aitem_cener">
					<text class="dec_num">1</text>
					<view class="dec_text">
						上传发布至淘气游平台
					</view>
				</view>
				<view class="flex aitem_cener">
					<text class="dec_num">2</text>
					<view class="dec_text">
						上传发布后由淘气游客服进行审核
					</view>
				</view>
				<view class="flex aitem_cener">
					<text class="dec_num">3</text>
					<view class="dec_text">
						上传的账号由平台以及合作主播进行曝光推广
					</view>
				</view>
				<view class="flex aitem_cener">
					<text class="dec_num">4</text>
					<view class="dec_text">
						买家确认交易并付款，由客服拉企业微信群聊引导双方完成交易
					</view>
				</view>
			</view>
		</view>
		<view class="card flex" @click="navigateTo('select_game', `?url=business`)">
			<view class="left">
				<view class="title">
					商家回收
				</view>
				<view class="sub_title">
					由淘气游平台合作商家快速回收
				</view>
				<view class="dec flex aitem_cener ">
					详情介绍 
					<image src="../../static/sell/icon_down@2x.png" mode="aspectFill" style="width: 20rpx;height: 20rpx;margin-left: 10rpx;"></image>
				</view>
			</view>
			<image class="rigntImg" src="../../static/sell/icon_2@2x.png" mode="aspectFill"></image>
		</view>	
		<view class="card flex" @click="navigateTo('guarantee')">
			<view class="left">
				<view class="title">
					中介担保
				</view>
				<view class="sub_title">
					买卖双方协商至淘气游官方平台交易
				</view>
				<view class="dec flex aitem_cener ">
					详情介绍 
					<image src="../../static/sell/icon_down@2x.png" mode="aspectFill" style="width: 20rpx;height: 20rpx;margin-left: 10rpx;"></image>
				</view>
			</view>
			<image class="rigntImg" src="../../static/sell/icon_3@2x.png" mode="aspectFill"></image>
		</view>	
		<k-tabbar />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss" scoped>
	.sell {
		height: 80vh;
		padding: 450rpx 35rpx 35rpx 35rpx;
		background: url(~@/static/sell/bg_@2x.png) no-repeat;
		background-size: 100%;
		padding-bottom: 150rpx;
		.card {
			justify-content: space-between;
			padding: 35rpx;
			margin-bottom: 20rpx;
			border-radius: 44rpx 44rpx 44rpx 44rpx;
			background: linear-gradient( 180deg, #FFFFFF 0%, #FFF2E5 100%);
			box-shadow: inset 8rpx 8rpx 8rpx 0rpx rgba(255,255,255,0.25), 4rpx 4rpx 8rpx 0rpx rgba(255,133,78,0.52);
		}
		.title {
			font-weight: 800;
			font-size: 44rpx;
			line-height: 52rpx;
			color: white;
			background: linear-gradient(90deg, #FF730D, #FFDCA8);
			-webkit-background-clip: text;
			background-clip: text;
			-webkit-text-fill-color: transparent;
			text-fill-color: transparent;
			-webkit-box-decoration-break: clone;
			box-decoration-break: clone;
		}
		.sub_title {
			font-weight: 500;
			font-size: 24rpx;
			color: #9B9B9B;
			padding: 20rpx 0;
		}
		.rigntImg {
			width: 160rpx;
			height: 182rpx;
			padding-right: 15rpx;
		}
		.dec {
			display: inline-block;
			padding: 0 30rpx;
			font-weight: 500;
			font-size: 20rpx;
			color: #813600;
			// width: 164rpx;
			height: 46rpx;
			line-height: 48rpx;
			background: #FFEEB0;
			border-radius: 44rpx 44rpx 44rpx 44rpx;
		}
		.totas {
			margin: 15rpx 0;
			padding: 15rpx;
			background: rgba(255,255,255,0.5);
			box-shadow: inset 2rpx 2rpx 2rpx 0rpx rgba(255,255,255,0.56);
			border-radius: 20rpx 20rpx 20rpx 20rpx;
			position: relative;
			&::after {
				position: absolute;
				top: -45rpx;
				left: 44rpx;
			  content: "";
			  width: 0;
			  height: 0;
			  border: 15px solid;
			  border-color: transparent transparent rgba(255,255,255,0.5) transparent;
			}
		}
		.dec_text {
			font-weight: 500;
			font-size: 20rpx;
			color: #6C6C6C;
			line-height: 32rpx;
		}
		.dec_num {
			font-weight: bold;
			font-size: 20rpx;
			color: #FF8080;
			width: 24rpx;
			height: 24rpx;
			line-height: 24rpx;
			background: #FFDDDD;
			text-align: center;
			border-radius: 50%;
			margin-right: 8rpx;
		}
	}

</style>
